<template>
	<view>
		<view class="content-padding">
			<view class="card-input">
				<view class="">手机号</view>
				<input type="number" v-model="mobile" placeholder="请输入手机号" />
			</view>
			<view class="card-input" style="padding-right: 30rpx;position: relative;">
				<view class="">验证码</view>
				<input type="text" v-model="code" placeholder="请输入验证码" />
				<text class="yanzhengma" @tap="isCode && getCode()">{{codeText}}</text>
			</view>
			<view class="card-input">
				<view class="">昵称</view>
				<input type="text" v-model="username" placeholder="请输入昵称" />
			</view>
			<view class="card-input">
				<view class="">密码</view>
				<input type="text" password v-model="password" placeholder="请输入登录密码" />
			</view>
			<view class="card-input">
				<view class="">确认密码</view>
				<input type="text" password v-model="newpassword" placeholder="请再次输入登录密码" />
			</view>
			<view class="shenfenView" style="border: unset;">
				<view class="shenfen">身份</view>
				<u-radio-group v-model="type" style="padding-left: 20rpx;flex: 1;height:40rpx;font-size:28rpx;font-weight:400;line-height:40rpx;">
					<u-radio name="1">
						买家
					</u-radio>
					<u-radio name="2">
						商家
					</u-radio>
				</u-radio-group>
			</view>
		</view>
		<view class="">
			<view class="" style="padding: 0 54rpx; ">
				<view class="zhuce" @tap="submit()">完成注册</view>
			</view>
		</view>
		<selfPopupMessage ref="selfPopupMessage"></selfPopupMessage>
	</view>
</template>

<script>
	const sharetrace = uni.requireNativePlugin('shoot-sharetrace');

	export default {
		data() {
			return {
				codeText: "发送验证码",
				isCode: true,
				mobile: "",
				code: "",
				password: "",
				newpassword: "",
				username: "",
				type: 1
			}
		},
		onReady() {
			//获取安装携带参数
			sharetrace.getInstallTrace(data => {
				// this.showResult(JSON.stringify(data));
				var str = data.data.paramsData;
				var arr1 = str.split("&");
				var obj = {};
				for (let i = 0; i < arr1.length; i++) {
					var arr2 = arr1[i].split("=");
					obj[arr2[0]] = arr2[1];
				}

				var incode = obj.id;
				uni.setStorageSync("yaoqing_uid", incode);
			});
		},
		methods: {
			getCode() {
				if (this.$util.checkmobile(this.mobile)) {
					this.$refs.selfPopupMessage.open("请输入正确的手机号", "error");
					return;
				}
				this.isCode = false;
				var miao = 60;
				var that = this;
				this.$util.nuiAjax(this.$jiekou.getCode, {
					mobile: this.mobile
				}, function(res) {
					if (res.result == "true") {
						var intervalId = setInterval(function() {
							if (miao >= 1) {
								that.codeText = miao + "s";
								miao--;
							} else {
								that.isCode = true;
								that.codeText = "重新获取";
								clearInterval(intervalId);
							}
						}, 1000)
						that.$refs.selfPopupMessage.open(res.message);
					} else {
						that.$refs.selfPopupMessage.open(res.message, "error");
					}
				})
			},
			submit() {

				if (this.$util.checkmobile(this.mobile)) {
					this.$refs.selfPopupMessage.open("请输入正确的手机号", "error");
					return;
				}
				if (this.code == "") {
					this.$refs.selfPopupMessage.open("请输入验证码", "error");
					return;
				}
				if (this.username == "") {
					this.$refs.selfPopupMessage.open("请输入昵称", "error");
					return;
				}
				if (this.password == "") {
					this.$refs.selfPopupMessage.open("请输入密码", "error");
					return;
				}
				if (this.newpassword == "") {
					this.$refs.selfPopupMessage.open("请再次输入密码", "error");
					return;
				}
				if (this.newpassword != this.password) {
					this.$refs.selfPopupMessage.open("两次输入的密码不同，请重新输入", "error");
					return;
				}
				var yaoqing_uid = uni.getStorageSync("yaoqing_uid");
				var that = this;
				this.$util.nuiAjax(this.$jiekou.zhuceMobile, {
					yaoqingUid: yaoqing_uid,
					mobile: this.mobile,
					username: this.username,
					code: this.code,
					password: this.password,
					type: this.type
				}, function(res) {
					if (res.result == "true") {
						that.$refs.selfPopupMessage.open(res.message, "success", 1000, function() {
							that.$util.goback();
						});
					} else {
						that.$refs.selfPopupMessage.open(res.message, "error");
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.yanzhengma {
		width: 144rpx;
		height: 40rpx;
		font-size: 28rpx;
		font-weight: 400;
		color: $uni-color-primary;
		line-height: 40rpx;
		// padding: 10rpx;
		// box-shadow: 1rpx 1rpx 1rpx #f1f1f1
		// border: 1rpx $uni-color-primary solid;
		// position: absolute;
		// right: 30rpx;
		text-align: center;
		// margin: auto;
		// top: 0;
		// bottom: 0;
	}

	.zhuce {
		background-color: $uni-color-primary;
		height: 96rpx;
		border-radius: 48rpx;
		margin-top: 100rpx;
		text-align: center;
		line-height: 96rpx;
		color: $uni-text-color-inverse;
		letter-spacing: 1rpx;
		font-size: 32rpx;
	}

	page {
		background-color: $page-bg-color;
	}

	.content-padding {
		padding: 0 0 0 30upx;
		background-color: #FFFFFF;
	}

	.card-input {
		padding: 30rpx 0;
		display: flex;
		flex-flow: row;
		border-bottom: #EFEFEF solid 1rpx;
	}

	.shenfenView {
		padding: 30rpx 0;
		display: flex;
		flex-flow: row;
		border-bottom: #EFEFEF solid 1rpx;
	}

	.shenfen {
		width: 116rpx;
		height: 40rpx;
		font-size: 28rpx;
		line-height: 40rpx;
	}

	.card-input view {
		width: 116rpx;
		height: 40rpx;
		font-size: 28rpx;
		line-height: 40rpx;
	}

	.card-input input {
		padding-left: 20rpx;
		flex: 1;
		height: 40rpx;
		font-size: 28rpx;
		font-weight: 400;
		line-height: 40rpx;
	}
</style>
